import 'package:flutter/material.dart';
import 'package:junyeyishu/utils/utils.dart';
import 'package:junyeyishu/widgets/QGWidget.dart';

class QGDrawerWidget extends StatefulWidget {
  int index;
  List<String> items;
  Function(int index) onSelect;
  QGDrawerWidget(
      {super.key,
      required this.index,
      required this.items,
      required this.onSelect});
  @override
  State<QGDrawerWidget> createState() => _QGDrawerWidgetState();
}

class _QGDrawerWidgetState extends State<QGDrawerWidget> {
  bool showing = false;

  @override
  Widget build(BuildContext context) {
    return GestureDetector(
      onTap: show,
      child: Container(
        width: 90.rpx,
        height: 24.rpx,
        decoration: showing || widget.items[widget.index] != "等级排序"
            ? BoxDecoration(
                color: const Color(0xFF111111),
                borderRadius: BorderRadius.circular(6.rpx),
              )
            : BoxDecoration(
                border:
                    Border.all(width: 0.5.rpx, color: const Color(0xFF111111)),
                color: Colors.transparent,
                borderRadius: BorderRadius.circular(6.rpx),
              ),
        child: Row(
          mainAxisAlignment: MainAxisAlignment.center,
          crossAxisAlignment: CrossAxisAlignment.center,
          children: [
            Text(
              widget.items[widget.index],
              style: TextStyle(
                  color: showing || widget.items[widget.index] != "等级排序"
                      ? const Color(0xFFDEFF80)
                      : const Color.fromRGBO(17, 27, 27, 0.6),
                  fontSize: 11.rpx,
                  fontWeight: FontWeight.normal),
            ),
            SizedBox(width: 5.rpx),
            showing || widget.items[widget.index] != "等级排序"
                ? QGImage(asset: "sale_triangle_active")
                : QGImage(asset: "sale_triangle")
          ],
        ),
      ),
    );
  }

  show() {
    showing = true;
    setState(() {});

    showDialog(
        useSafeArea: false,
        barrierColor: Colors.transparent,
        context: context,
        builder: (context) {
          return QGDrawerListWidget(
              index: widget.index,
              items: widget.items,
              onSelect: widget.onSelect);
        }).then((value) {
      showing = false;
      if (mounted) {
        setState(() {});
      }
    });
  }
}

class QGDrawerListWidget extends StatefulWidget {
  int index;
  List<String> items;
  Function(int index) onSelect;
  QGDrawerListWidget(
      {super.key,
      required this.index,
      required this.items,
      required this.onSelect});
  @override
  State<QGDrawerListWidget> createState() => _QGDrawerListWidgetState();
}

class _QGDrawerListWidgetState extends State<QGDrawerListWidget> {
  @override
  Widget build(BuildContext context) {
    return Column(
      children: [
        SizedBox(height: 116.rpx + kSafeTop),
        Expanded(
          child: GestureDetector(
            onTap: () {
              Navigator.of(context).pop();
            },
            child: Container(
              color: Colors.black54,
              width: kScreenWidth,
              child: SingleChildScrollView(
                child: Container(
                    child: Column(
                  children: buildItems(),
                )),
              ),
            ),
          ),
        ),
      ],
    );
  }

  List<Widget> buildItems() {
    List<Widget> children = [];
    for (int i = 1; i < widget.items.length; i++) {
      children.add(GestureDetector(
        onTap: () {
          onTap(i);
        },
        child: Container(
          color: const Color(0xffffffff),
          width: kScreenWidth,
          padding: EdgeInsets.symmetric(vertical: 10.rpx, horizontal: 20.rpx),
          child: Text(
            widget.items[i],
            style: TextStyle(
                color:
                    widget.index == i ? Color(0xFF5E85E3) : Color(0xff111111),
                fontSize: 12.rpx,
                fontWeight: FontWeight.normal),
          ),
        ),
      ));
    }

    return children;
  }

  onTap(int i) async {
    widget.onSelect(i);
    widget.index = i;
    setState(() {});
    await Future.delayed(const Duration(milliseconds: 300));
    Navigator.of(context).pop();
  }
}
